<template>
  <div id="app">
    <div class="page">
      <home-head message="新闻"></home-head>
      <news-nav></news-nav>
        <div class="content">
          <router-view class="fadeView"></router-view>
        </div>

        <!--<router-view></router-view>-->

      <home-footer></home-footer>
    </div>
    <nav-menu></nav-menu>
  </div>
</template>

<script>
import HomeHead from './components/headEnd/head'
import HomeFooter from './components/headEnd/footer'
import NavMenu from './components/public/Menu'
import NewsNav from './components/public/Nav'

export default {
  name: 'app',
  components: {
    HomeHead,
    HomeFooter,
    NavMenu,
    NewsNav
  }
}
</script>

<style lang="stylus">
.content{
  width: 100%;
  min-height: 400px;
  background: #fff;
}
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  overflow:hidden;
}
*{
  margin:0;
  padding: 0;
}
.page{
  position: relative;
  z-index: 99;
  transition: all 0.5s;
}
.toggle{
  transform: translateX(-120px);
}

</style>
